<%@ page import="com.iflytek.management.pojo.SysUser" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html>
<% String path = request.getContextPath();
   String basepath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path;%>
<head>
    <meta charset="utf-8">
    <title>管理系统</title>
    <link rel="stylesheet" href="<%=basepath %>/static/css/jquery.date.css">
    <link rel="stylesheet" type="text/css" href="<%=basepath %>/static/css/mainStyle.css"/>
    <script type="text/javascript" src="<%=basepath %>/static/js/jquery-1.4.2.js"></script>
    <script type="text/javascript" src="<%=basepath %>/static/js/service.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js"></script>
</head>
<style>
    h1 {
        margin: 20px 0 40px 0
    }

    input, select {
        padding: 10px 20px;
        line-height: 25px;
        width: 400px;
        border-radius: 5px;
        background-color: rgba(255, 255, 255, 0.6);
    }

    button {
        width: 80px;
        height: 40px;
        line-height: 40px;
        border-radius: 5px;
    }

    .sx {
        float: left;
        width: 1px;
        height: 550px;
        background: darkgray;
        margin: 10px 30px;
    }

    /* 留言部分 */
    #message {
        width: 400px;
        height: 200px;
        border: 1px solid blue;
        outline: none;
        resize: none;
    }

    #liuyan ul {
        margin-top: 50px;
    }

    #liuyan li {
        width: 600px;
        padding: 5px;
        background-color: rgb(209, 245, 240);
        color: blue;
        font-size: 14px;
        margin: 15px 0;
    }
</style>
<body style="background: url(<%=basepath %>/static/image/bg.png) no-repeat fixed;">
<nav>
    <div class="logo"><a href="<%=basepath %>/jsp/main.jsp" style="font-size: 22px;color: #1890ff;">在线项目协作管理平台</a></div>
    <!-- 侧边栏 -->
    <nav class="left">
        <%--            分角色登录--%>
        <%SysUser user = (SysUser) session.getAttribute("user");%>
        <% if (user.getRoleid().equals("1")) {%>
        <div id="user">
            <span>用户管理</span>
            <ul>
                <li><a href="#" onclick="showAllMember()" >显示所有员工</a></li>
                <li><a href="#" onclick="showAddUser()">添加员工</a></li>
                <li><a href="#" onclick="toReset()">重置密码</a></li>
            </ul>
        </div>
        <div id="pro">
            <span>项目管理</span>
            <ul>
                <li><a href="#" onclick="showAllPro()">显示项目</a></li>
                <li><a href="#" onclick="showAddPro()">添加项目</a></li>
            </ul>
        </div>
        
        <%}%>
        <div class="userpage" id="manager1">
            <a href="#" onclick="showLiuyan()">查看留言</a>
        </div>
        
        <%if (!user.getRoleid().equals("1")) {%>
        <div class="userpage" id="normal1">
            <a href="#" onclick="editUser(${user.userid}, 2)">个人信息</a>
        </div>
        <%}%>
        <%if (user.getRoleid().equals("3")) {%>
        <div class="userpage" id="normal2">
            <a href="#" onclick="openPro(${user.userid}, 2)">我参与的项目</a>
        </div>
        <%}%>
        <%if (user.getRoleid().equals("2")) {%>
        <div class="userpage" id="manager1">
            <a href="#" onclick="openPro(${user.userid}, 1)">我的项目</a>
        </div>
        <%}%>
        
        <%if (user.getRoleid().equals("2") || user.getRoleid().equals("1")) {%>
        <div class="userpage" id="manager1">
            <a href="#" onclick="toAddTask()">下发任务</a>
        </div>
        <%}%>
        <%if (user.getRoleid().equals("2") || user.getRoleid().equals("3")) {%>
        <div class="userpage" id="manager1">
            <a href="#" onclick="showTask(${user.userid})">查看任务</a>
        </div>
        <%}%>
    </nav>
</nav>
<!-- header -->
<header>
    <div class="top" style="display: flex;justify-content: space-between;align-items: center">
            <span id="datetime">
                <script>
                    setInterval("document.getElementById('datetime').innerHTML=new Date().toLocaleString();", 1000);
                </script>
            </span>
        <span class="mid">
                <span style="padding-left: 0;padding-right: 0;"><img alt=""
                                                                     src="${user.pic==null?"/management/static/image/admin.png":user.pic}"
                                                                     style="width:42px; height:42px; border-radius:50%;"></span>

                <span style="padding-left: 15px;padding-right: 0">
                    <a href="#" style="text-align: center;display: inline-block;vertical-align: middle">
                        <span style="padding: 0">${user.name}</span>
                        <span style="color:#ff0066;display: block;padding: 0">
                            ${user.roleid== 1?"管理员":""}
                            ${user.roleid== 2?"技术负责人":""}
                            ${user.roleid== 3?"员工":""}
                        </span>
                    </a>
                </span>
            </span>
        <span><a href="#" onclick="doLoginOut()" style="color: crimson;">丨退出登录</a></span>
    </div>
</header>
<section>
    <div class="right">
        <!-- 这里是ajax内容区域 -->
        <div id="mainframe">

        </div>
    </div>
</section>
</body>
<script>
    /**
     * 显示留言 的同时 保存留言
     */
    function printMess() {
        // 点击发布，会把文本域中的内容发布到ul中
        // 1.获取事件源 文本域 按钮 文本域
        var text = document.querySelector('#message');
        var ul = document.querySelector('#liuyan');
        var hid = document.getElementById("hid").value;

        // 2.点击事件内容
        // 先存到数据库
        saveMessage(hid);
        // 首先会创建一个li 并把文本域的内容给li 再把li添加到ul中
        var li = document.createElement('li');
        if (text.value == '') {
            alert('您没有输入内容')
        } else {
            // 文本域的值 value
            li.innerHTML = '${user.name}-----' + '${user.roleid== 1? "<span style=\"color:red\">管理员</span><span> -----:</span>":""}' +
                '${user.roleid== 2? "<span style=\"color:yellow\">项目经理</span><span> -----:</span>":""}' +
                '${user.roleid== 3? "<span style=\"color:black\">员工</span><span> -----:</span>":""}' +
                text.value + "<br>" + Date();
            ul.insertBefore(li, ul.children[1]); // 把最新的发布放到最前面
            // ul.appendChild(li);
        }
    }

</script>
</html>